import Vue from 'vue'
import VueRouter from 'vue-router'
import VueResource from 'vue-resource'
import Vuex from 'vuex'
Vue.use(VueResource)
Vue.use(VueRouter)
Vue.use(Vuex)


import '../less/style.less'

// 修改



//导入mui组件
import '../lib/mui/css/mui.min.css'
//导入mui扩展字体库
import '../lib/mui/css/icons-extra.css'



//导入根组件
import app from '../App.vue'



// vantui
import {
  Tabbar,
  TabbarItem,
  Swipe,
  SwipeItem,
  Lazyload,
  Grid,
  GridItem,
  Cell,
  CellGroup,
  Icon,
  Toast,
  Stepper, 
  Checkbox, CheckboxGroup
} from 'vant';

//底部导航
Vue.use(Tabbar).use(TabbarItem);
//轮播图
Vue.use(Swipe).use(SwipeItem);
//懒加载
Vue.use(Lazyload);
//格子
Vue.use(Grid).use(GridItem);
//单元格
Vue.use(Cell).use(CellGroup);
Vue.use(Icon);
Vue.use(Toast);
Vue.use(Stepper);
Vue.use(Checkbox).use(CheckboxGroup);
//接受router.js
import router from './router.js'

import moment from 'moment'
//全局事件過濾器
Vue.filter("dateFormat", function (dataStr, pattern = "YYYY-MM-DD HH:mm:ss") {
  return moment(dataStr).format(pattern);
})

//创建的时候就获取数据
let goodsInfo = JSON.parse(localStorage.getItem("goods")|| "[]")





let store = new Vuex.Store({
  state: {
    //底部导航栏显示和隐藏
      tabBarShow:true,
      //底部导航栏索引
      active:0,
      // 存放商品的
      goods:goodsInfo,
      // 存放搜索的input的value值
      inputValue:"",
      //数据库所有商品 信息 便于后面搜索
      allGoodsInfo:[],
  },
  mutations: {
    //改变tabbar的隐藏
    changeTabBarShow(state){
        state.tabBarShow = false;
    },
    changeTabBarHidden(state){
      state.tabBarShow = true;
    },
    changeTabBarShowSecond(state,path){
      if(path=='/register' || path=='/login'){
        state.tabBarShow=false;
      }
    },
    changeActive(state){
        state.active=0;
    },
    //改变goods里的内容  添加商品或者删除商品  goodsInfo传入完整商品数据
    changeGoods(state,goodsInfo){
      // 从goods里面查找有没有相同的商品，有就只添加数量  goodsInfo传id和数量
       let flag = false;
        state.goods.some((item,i)=>{
            if(item.id == goodsInfo.id){
              //找到了相同的id就追加
              item.count += goodsInfo.count;
              item.allPrice = item.count * parseInt(item.price)
              flag=true;
              return true;
            }
        })
        if(flag==false){
          //没有找到就追加数据进去
          goodsInfo.allPrice = goodsInfo.count * parseInt(goodsInfo.price)
          state.goods.push(goodsInfo);
        }
    },
    // 购物车check改变goods里内容
    checkGoods(state,goodsInfo){
        state.goods.some((item,i)=>{
          if(item.id == goodsInfo){
            state.goods.splice(i,1);
            return true;
          }
        })
    },
    stepperChangeGoods(state,goodsInfo){
      // 需要把id和数量传过来 重新赋值
        state.goods.some((item,i)=>{
            if(item.id==goodsInfo.id){
              item.count = goodsInfo.count;
              item.allPrice = item.count * parseInt(item.price)
              return true;
            }
        })
    },
    // 每次改变了header组件的input值都更改state的inputValue
    changeInputvalue(state,value){
        state.inputValue = value;
    },
    //获取所有商品 便于搜索
    getAllGoodsInfo(state,goods){
        state.allGoodsInfo =goods;
    }
  },
  getters: {
    //保存购物车数量 同步实时跟新
      getGoodsAllCount(state){
        // 保存数量
        let c=0;
         state.goods.forEach((item,i)=>{
          c+=item.count;
         })
         return c;
      },
      //获取所有商品总价格
      getAllGoodsPrice(state){
        let p =0;
        state.goods.forEach(item=>{
          p+=item.allPrice;
        })
        return p
      },
      // 获取搜索到的匹配值
      getCheckSearh(state){

          if(state.inputValue==""){
            return [];
          }else{
            return state.allGoodsInfo.filter(item=>{
                if(item.name.includes(state.inputValue)){
                  return item
                }
            })
          }
      }
  }

})




let v = new Vue({
  el: "#app",
  data: {

  },
  methods: {

  },
  render: c => c(app),
  router,
  store
})